import { useLocation } from "react-router";
/**. State 方式
适用于：传递复杂数据结构
特点：支持任意类型数据，参数不显示在URL
限制：刷新可能丢失，不利于分享,同个浏览器刷新还是在的，复制页面也在，发给别人打开就没了
选择建议：必要参数用 Params，筛选条件用 Query，临时数据用 State
 * 
 * <Link to="/user" state={{ name: '小满zs', age: 18 }}>User</Link> //1. Link 跳转
<NavLink to="/user" state={{ name: '小满zs', age: 18 }}>User</NavLink> //2. NavLink 跳转
import { useNavigate } from 'react-router'
const navigate = useNavigate()
navigate('/user', { state: { name: '小满zs', age: 18 } }) //3. useNavigate 跳转

 * @returns 
 */

export default function RouteState() {
  const location = useLocation();

  console.log("location==>", location.state);
  return (
    <div>
      <h1>RouteState</h1>

      <p>{location.state?.name}</p>
    </div>
  );
}
